<template>
    <Layout>

        <v-btn-toggle class="fill-height" align="center" width="100%">
            <template v-for="cat in $page.KuERP.allContentFolder">
                <v-btn cols="12" md="2" sm="3" style="padding: 10px;" :to="'/folder/'+cat.id">

                    <g-image
                            src="http://download.kaikong.cn/web/20180314094808649.png"/>
                    <p class="font-weight-thin" style="font-size:12px;">
                        {{ cat.name }}
                    </p>

                </v-btn>
            </template>
        </v-btn-toggle>
        <v-container>
            <template v-for="product in $page.KuERP.allContentContent">
                <v-hover v-slot:default="{ hover }">
                    <v-card :hover="hover" style="padding: 10px" :href="'/content/'+product.id">
                        <v-container>
                            <h4>{{product.name}}</h4>
                            <p> {{ product.subtitle }} </p>
                            <v-row>
                                <div v-for="tag in product.tag_ids">
                                    <v-tag>{{tag.name}}</v-tag>
                                </div>
                                <p style="font-size: 12px">{{product.visits}}浏览 . </p>
                                <p style="font-size: 12px">{{product.writeDate}}</p></v-row>
                        </v-container>
                    </v-card>
                </v-hover>

            </template>
        </v-container>
    </Layout>
</template>
<page-query>
    query{
    KuERP{
    allContentFolder(domain:"[[\"public\",\"=\",\"True\"]]"){
    id
    name
    }
    allContentContent(domain:"[[\"public\",\"=\",\"True\"]]"){
    id
    name
    subtitle
    visits
    writeDate
    }}
    }
</page-query>
<script>
    import config from '../../gridsome.config';

    export default {
        metaInfo: {
            title: "技术与产品文档",
            meta: [{name: "description", conetnt: "技术与产品文档"},
                {name: "keywords", content: "技术与产品文档"},
                {"http-equiv": "X-UA-Compatible", content: "IE=edge"},
                {
                    name: "viewport",
                    content: "width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0"
                }, {name: "apple-mobile-web-app-capable", content: "yes"},
                {name: "apple-mobile-web-app-status-bar-style", content: "black"},
                {name: "format-detection", content: "telephone=no"},
                {property: "og:type", content: "website"},
                {
                    property: "og:title",
                    content: "技术与产品文档"
                },
                {
                    property: "og:description",
                    content: "技术与产品文档"
                },
                {
                    property: "og:image",
                    content: "https://www.kaikong.cn/web/image/res.company/1/logo?unique=2742a8f"
                },
                {property: "og:url", content: config.siteUrl + "/content"}]
        },
        data() {
            return {cat: '', odooUrl: config.odooUrl,}
        }
    }
</script>

<style>
    .home-links a {
        margin-right: 1rem;
    }


</style>
